<template>
<div id="recruit">
  <div>
    <el-radio-group v-model="radio" @change="searchHandle">
      <el-radio-button label="1" >笔试</el-radio-button>
      <el-radio-button label="2" >面试</el-radio-button>
      <el-radio-button label="3"  >已通过</el-radio-button>
      <el-radio-button label="4" >未通过</el-radio-button>
    </el-radio-group>
  </div>
  <el-table
      height="536"
      :data="deliverList"
      v-loading="loading"
      element-loading-text="拼命加载中"
      style="width: 99.5%">
    <el-table-column
        label="序号"
        align="center"
        type="index"
        :index="indexMethod">
    </el-table-column>
    <el-table-column
        label="应聘者"
        prop="userName"
        align="center"
        show-overflow-tooltip>
    </el-table-column>
    <el-table-column
        label="应聘职位"
        prop="jobName"
        align="center"
        show-overflow-tooltip>
    </el-table-column>
    <el-table-column
        label="应聘方式"
        align="center"
        prop="applyWay"
        show-overflow-tooltip>
    </el-table-column>
    <el-table-column
        label="应聘地点"
        prop="applyCity"
        align="center"
        show-overflow-tooltip>
    </el-table-column>
    <el-table-column
        label="投递时间"
        prop="createTime"
        sortable
        align="center"
        show-overflow-tooltip>
    </el-table-column>
    <el-table-column
        label="操作"
        align="center"
        width="260%">
      <template v-slot:header>
        <el-input size="small" @keyup.enter.native="searchHandle"  v-model="keywords"
                  placeholder="搜索应聘者、应聘职位"></el-input>
      </template>
      <template slot-scope="scope">
        <el-tooltip  class="item" effect="light" content="发送通知" placement="top" >
          <el-button  @click="startSendMsg(scope.row.userName)" icon="el-icon-s-promotion" size="mini" type="info"></el-button>
        </el-tooltip>
        <el-tooltip class="item" effect="light" content="简历详情" placement="top" >
          <el-button @click="getResumeInfo(scope.row.resumeId)" class="iconfont icon-xiangqing" size="mini" type="success"></el-button>
        </el-tooltip>
        <el-tooltip v-show="btn_show" class="item" effect="light" content="通过" placement="top" >
          <el-button @click="passHandler(scope.row.deliverId,scope.row.userName,scope.row.state,'pass')" size="mini" class="iconfont icon-shenhetongguo"
                     type="success"></el-button>
        </el-tooltip>
        <el-tooltip  class="item" effect="light" content="不通过" placement="top" >
          <el-button v-show="btn_show" @click="passHandler(scope.row.deliverId,scope.row.userName,scope.row.state,'noPass')" size="mini" class="iconfont icon-shenhebutongguo"
                     type="danger"></el-button>
        </el-tooltip>
      </template>
    </el-table-column>
  </el-table>
  <el-pagination
      background
      layout="total,prev, pager, next"
      :total="total"
      align="center"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-size="pageSize"
      :hide-on-single-page="value"
      style="padding-top: 15px"
  >
  </el-pagination>
  <el-dialog title="简历详情" :visible.sync="dialogTableVisible" top="0" >
    <el-descriptions :column="3"  border>
      <template slot="extra">
        <el-tag type="info">{{ this.resume.resumeName }}</el-tag>
      </template>
      <el-descriptions-item label="照片">
        <el-image :src="this.resume.photoUrl" style="width:40px;height:50px">
          <div slot="error" class="image-slot">
            <i class="el-icon-picture-outline" style="font-size: 40px;color:#E4E7ED"></i>
          </div>
        </el-image>
      </el-descriptions-item>
      <el-descriptions-item label="姓名">{{ this.resume.name }}</el-descriptions-item>
      <el-descriptions-item label="性别">{{ this.resume.sex }}</el-descriptions-item>
      <el-descriptions-item label="年龄">{{ this.resume.age }}</el-descriptions-item>
      <el-descriptions-item label="民族">{{ this.resume.nation }}</el-descriptions-item>
      <el-descriptions-item label="籍贯">{{ this.resume.nativePlace }}</el-descriptions-item>
      <el-descriptions-item label="居住地">{{this.resume.residence}}</el-descriptions-item>
      <el-descriptions-item label="手机号">{{this.resume.tel}}</el-descriptions-item>
      <el-descriptions-item label="邮箱">{{this.resume.email}}</el-descriptions-item>
      <el-descriptions-item label="政治面貌">{{this.resume.politicsStatus}}</el-descriptions-item>
      <el-descriptions-item label="期望薪资">{{this.resume.expectSalary}}</el-descriptions-item>
      <el-descriptions-item label="毕业院校">{{this.resume.university}}</el-descriptions-item>
      <el-descriptions-item label="毕业时间">{{this.resume.graduationTime}}</el-descriptions-item>
      <el-descriptions-item label="工作时间" :span="2">{{this.resume.workTime}}</el-descriptions-item>
      <el-descriptions-item label="自我评价" :span="3">{{this.resume.selfEvaluation}}</el-descriptions-item>
      <el-descriptions-item label="技能" :span="3">{{this.resume.skill}}</el-descriptions-item>
      <el-descriptions-item label="工作经历" :span="3">{{this.resume.workExperience}}</el-descriptions-item>
      <el-descriptions-item label="项目经历" :span="3">{{this.resume.project}}</el-descriptions-item>
      <el-descriptions-item label="所获荣誉" :span="3">{{this.resume.honor}}</el-descriptions-item>
      <el-descriptions-item  label="附件" :span="3">
        <el-link :href="this.resume.accessoryUrl" type="primary"> 下载</el-link>
      </el-descriptions-item>
    </el-descriptions>
  </el-dialog>
  <el-dialog title="发送通知" :visible.sync="dialogSendMsg" :close-on-click-modal="false" @close="closeSendMsg">
    <el-input
        type="textarea"
        placeholder="请输入内容"
        v-model="textarea"
        :rows="8"
        maxlength="150"
        show-word-limit
    >
    </el-input>
    <span slot="footer" class="dialog-footer">
    <el-button @click="dialogSendMsg = false">取 消</el-button>
    <el-button type="primary" @click="sendMsg">发 送</el-button>
  </span>
  </el-dialog>
</div>
</template>

<script>
import {getDeliverList, passResume, resumeInfo, sendMessage} from "../../network/companyUser";
export default {
  name: "ResumeManage",
  components:{

  },
  data() {
    return {
      radio:'1',
      loading: true,
      keywords: '',
      value: false,
      currentPage: 1,
      total: 1,
      pageSize: 9,
      dialogTableVisible:false,
      companyName:'',
      formLabelWidth:"120px",
      deliverList:[],
      resume:{},
      dialogSendMsg:false,
      receiveUserName:'',
      textarea:'',
      btn_show: true
    }
  },

  created() {
    this.companyName= localStorage.getItem("company_companyName");
    this.handleCurrentChange(this.currentPage);
  },
  methods: {
    handleCurrentChange(currentPage) {
      getDeliverList(this.keywords, currentPage, this.pageSize,this.companyName,this.radio).then(res => {
        this.loading = false;
        this.total = res.data.data.total;
        this.deliverList = res.data.data.list;
        this.currentPage = currentPage;
      })
    },
    searchHandle() {
      if(this.radio==3||this.radio==4){
        this.btn_show=false;
      }else{
        this.btn_show=true;
      }
      this.currentPage = 1;
      this.handleCurrentChange(this.currentPage)
    },
    indexMethod(index) {
      return (this.currentPage - 1) * this.pageSize + 1 + index;
    },

    passHandler(deliverId,userName,state,result) {
      if(result=="pass"){
        state++;
      }
      if(result=="noPass"){
        state = 4;
      }
      passResume(deliverId,state).then(res => {
        if (res.data.code == 100) {
          if(state==2){
            this.$message.success(userName+"进入面试阶段");
          }
          if(state==3){
            this.$message.success(userName+"已通过招聘");
          }
          if(state==4){
            this.$message.success(userName+"未通过招聘");
          }
        }
        this.handleCurrentChange(this.currentPage)
      }).catch()
    },
    getResumeInfo(resumeId) {
      resumeInfo(resumeId).then(res=>{
        if(res!=undefined){
          this.resume=res.data.data;
          this.dialogTableVisible=true;
        }
      })
    },
    startSendMsg(userName){
      this.receiveUserName = userName;
      this.dialogSendMsg = true;
    },
    sendMsg(){
      var sendUserName = localStorage.getItem("company_userName");
      sendMessage(sendUserName,this.receiveUserName,this.textarea).then(res => {
        if(res.data!=undefined){
          this.$message.success("发送成功");
          this.dialogSendMsg = false;
        }
      })
    },
    closeSendMsg(){
      this.textarea = '';
      this.receiveUserName = '';
    }
  },

}

</script>

<style scoped>
.demo-table-expand {
  font-size: 0;
}

.demo-table-expand label {
  min-width: 130px;
  height: 50px;
  color: #99a9bf;
}

.demo-table-expand .el-form-item {
  margin-left: 50px;
  margin-bottom: 0;
  width: 40%;
}

.el-form-item__content {
  height: 50px;
}
</style>